import { ref, inject, nextTick, onMounted, computed } from "vue";
import { uniqueId, remove } from "lodash-es";

/** 全局注册的 模块名 */
const activitiInfoModuleName = `activitiInfoStore`;

/**
 * 其他vuex模块的动态名称管理
 * @type { import("vuex").Module }
 *
 * @description
 * 定义一个vuex的模块名称管理模块。本模块专注于存储别人的模块名称。
 *
 * @deprecated
 * 动态模块管需要去考虑路由对组件的复用情况，无法保证每个组件都能够重新新建一次。
 */
const moduleNames = {
  namespaced: true,

  state: {
    /** @type { string[] } 存储的模块名称数组 */
    moduleNames: [],
  },

  mutations: {
    /** 获得一个全新的模块名
     * @description
     * 新建一个最新的值，存储，并返回
     */
    getNewModuleName(state, payload) {
      const id = uniqueId(`${activitiInfoModuleName}_`);
      state.moduleNames.push(id);
      return id;
    },

    /** 根据形参 移除指定的模块名称 */
    removeModuleName(state, payload) {
      state.moduleNames = remove(
        moduleNames.value,
        (item) => item === payload.id
      );
    },
  },

  getters: {
    getNewModuleName(state) {
      const id = uniqueId(`${activitiInfoModuleName}_`);
      state.moduleNames.push(id);
      return id;
    },
  },
};

export default moduleNames;
